let leftArrow = document.querySelector(".leftArrow");
let rightArrow = document.querySelector(".rightArrow");
let pointList = document.querySelectorAll(".pointBox li");
let ul = document.querySelector(".carouselBox ul");
let nowIndex = 0;
let active = document.querySelector(".active")
let active2 = document.querySelector(".active2")
let active3 = document.querySelector(".active3")

/**
 * 左箭头事件
 */
leftArrow.addEventListener("click", function() {

	// nowIndex++;

	// if(nowIndex == ul.childElementCount){
	// 	nowIndex = 0
	// }

	(++nowIndex == ul.childElementCount) && (nowIndex = 0)

	ul.style.transform = `translateX(-${nowIndex}00%)`;

	//左箭头小圆点的激活类跟着动
	if(nowIndex == 0){
		active.style.backgroundColor = "orange";
	active2.style.backgroundColor = "#fff";
	active3.style.backgroundColor = "#fff";
	}else if(nowIndex == 1){
		active2.style.backgroundColor = "orange";
	active.style.backgroundColor = "#fff";
	active3.style.backgroundColor = "#fff";
	}else{
		active3.style.backgroundColor = "orange";
		active.style.backgroundColor = "#fff";
		active2.style.backgroundColor = "#fff";
	}


})

/**
 * 右箭头事件
 */
rightArrow.addEventListener("click", function() {
	// nowIndex--;

	// if (nowIndex < 0) {
	// 	nowIndex = ul.childElementCount - 1;
	// }

	(--nowIndex < 0) && (nowIndex = ul.childElementCount - 1)

	ul.style.transform = `translateX(-${nowIndex}00%)` ;

	//右箭头小圆点的激活类跟着动
	if(nowIndex == 0){
		active.style.backgroundColor = "orange";
	active2.style.backgroundColor = "#fff";
	}else if(nowIndex == 1){
		active2.style.backgroundColor = "orange";
	active.style.backgroundColor = "#fff";
	active3.style.backgroundColor = "#fff";
	}else{
		active3.style.backgroundColor = "orange";
		active.style.backgroundColor = "#fff";
		active2.style.backgroundColor = "#fff";
	}
	// if(ul.style.transform = `translateX(-${nowIndex}00%)`){
	// 	active.style.backgroundColor = "orange";
	// active2.style.backgroundColor = "#fff";
	// active3.style.backgroundColor = "#fff";
	// }
	// if(ul.style.transform = `translateX(-${nowIndex}00%)`){
	// 	active3.style.backgroundColor = "orange";
	// active2.style.backgroundColor = "#fff";
	// }
	
})

//小圆点点击事件
active.addEventListener("click",function(){
	active.style.backgroundColor = "orange";
	active2.style.backgroundColor = "#fff";
	active3.style.backgroundColor = "#fff";
	ul.style.transform = "translateX(0%)";
})
active2.addEventListener("click",function(){
	active2.style.backgroundColor = "orange";
	active.style.backgroundColor = "#fff";
	active3.style.backgroundColor = "#fff";
	ul.style.transform = "translateX(-100%)";
})
active3.addEventListener("click",function(){
	active3.style.backgroundColor = "orange";
	active2.style.backgroundColor = "#fff";
	active.style.backgroundColor = "#fff";
	ul.style.transform = "translateX(-200%)";
})

// 定时器
ul = ul.setTimeout("javascript funct", milliseconds)
